///// <reference path="../libs/axios/axios.min.js" />
;
var controller = new Vue({
    el: '#app',
    data: {
        EmpName: '',
        EmpNum: '',
        skillPoints: []
    },
    updated: function() {
        $('input[type="radio"]').uCheck();
        $('.scrollspy-nav').scrollspynav({ offsetTop: 55 })
    },
    methods: {
        submit: function() {
            if ($('#sm').validator('isFormValid')) {
                skillPoints = [];
                var allRadios = $('input[type="radio"]:checked');
                _.forEach(allRadios, function(value, key) {
                    var $element = $(value);
                    skillPoints.push({ Id: $element.attr('name'), Degree: $element.val() });
                });
                g.lockAllInput();
                axios.post('/api/questionnaire/', {
                    EmpName: this.EmpName,
                    EmpNum: this.EmpNum,
                    SkillPoints: skillPoints
                }).then(val => {
                    g.handleResponse(val.data, function(res) {
                        $('#my-alert .am-modal-bd').html("提交成功!");
                        $('#my-alert').modal();
                    }, function(res) {
                        $('#my-alert .am-modal-bd').html(res.Msg);
                        $('#my-alert').modal();
                    });
                })
            }
        }
    }
});

axios.get('/api/questionnaire/')
    .then(function(response) {
        exTree(response.data.SkillPoints)
        controller.skillPoints = response.data.SkillPoints;

    })
    .catch(function(error) {
        console.log(error);
    });

function exTree(tree) {
    tree.forEach(function(element) {
        controller['skill' + element.Id] = element.Name;
    }, this);
}

$('#sm').validator({
    onValid: function(validity) {
        $(validity.field).closest('.am-form-group').find('.am-alert').hide();
    },
    onInValid: function(validity) {
        var $field = $(validity.field);
        var $group = $field.closest('.am-form-group');
        var $alert = $group.find('.am-alert');
        var msg = $field.data('validationMessage') || this.getValidationMessage(validity);

        if (!$alert.length) {
            $alert = $('<div class="am-alert am-alert-danger"></div>').hide().
            appendTo($group);
        }

        $alert.html(msg).show();
    }
})